<script>
// 采用 "选项式API" 书写
export default {
    /** 数据项 */
    data(){
        return {
            counter: 0,
            message: '欢迎来到西科大'
        }
    },
    /** 定义方法 */
    methods: {
        increment() {
            // 在方法内部可以通过 this.counter 来方法数据项中的内容
            console.log('hahaha');
            this.counter++;
        }
    },
    beforeCreate(){
        console.log("beforeCreate");
    },
    created() {
        console.log("created");
    }
}
</script>

<template>
    <p>HOME</p>
    <el-button type="primary" v-on:click="increment">你已经点了我{{counter}}次</el-button>
    <div>{{ counter }}</div>
    <el-button type="danger" @click="increment">你已经点了我{{counter}}次</el-button>
    <div>
        <el-input v-model="message"/>
        <p>{{ message }}</p>
    </div>
</template>